<!DOCTYPE html>
{{template "header" .}}
<title>
    文章-我的beego博客
</title>
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top">
    <div class="container">
        {{template "navbar" .}}
    </div>
</div>


<div class="page-header">
    <div class="container">
        <h1>文章列表</h1>
        <form method="post" action="/topic">
            <div class="form-group">
                <label>文章名称</label>
                <input id="name" class="form-control" placeholder="Enter account" name="name">
            </div>
            <div class="form-group">
                <label>文章分类</label>
                <input id="category" class="form-control" placeholder="Enter account" name="category">
            </div>
            <div class="form-group">
                <label>文章标签：</label>
                <input type="text" class="form-control" name="lable">
            </div>
            <div class="form-group">
                <label>文章内容</label>
                <input id="content" class="form-control" placeholder="Enter account" name="content"
                       style="height:100px">
            </div>
            <input type="hidden" name="op" value="add">
            <button type="submit" class="btn btn-default" onclick="return checkInput();">添加</button>
        </form>

        <script type="text/javascript">
            function checkInput() {
                var name = document.getElementById("name")
                if (name.value.length == 0) {
                    alert("请输入文章标题")
                    return false
                }

                var content = document.getElementById("content")
                if (content.value.length == 0) {
                    alert("请输入文章内容")
                    return false
                }
                return true

                var content = document.getElementById("category")
                if (content.value.length == 0) {
                    alert("请输入文章分类")
                    return false
                }
                return true
            }

        </script>
        <Table class="table table-striped" ?>
            <thred>
                <tr>
                    <th>#</th>
                    <th>名称</th>
                    <th>发布时间</th>
                    <th>浏览数</th>
                </tr>
            </thred>
            <tbody>
            {{range .Topics}}
            <tr>
                <th>{{.Id}}</th>
                <th>{{.Title}}</th>
                <th>{{.Created}}</th>
                <th>{{.Views}}</th>
            </tr>
            {{end}}
            </tbody>
        </Table>
    </div>
</div>
<script type="text/javascript" src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="/static/js/bootstrap.min.js"></script>
</body>
</html>